<template>
    <button @click="change">切换</button>
</template>
<script setup lang="ts">
import { useColorMode } from '@vueuse/core'
const modes = useColorMode({
    attribute: 'theme',
    modes: {
        dark: 'dark',
        light: 'light'
    }
})

const change = function () {
    if (modes.value == 'dark') modes.value = 'light'
    else modes.value = 'dark'
}
</script>   